<template>
	<view>
		<u-navbar back-text="返回" :title="surveydes.tit"></u-navbar>
		<view class="cont">
			<view class="head_img">
				<image src="https://up.bizhizu.com/pic/15/4e/b6/154eb6fd97636ac695aa6057d304cd57.jpg"></image>
			</view>
			<view class="head_tit">
				<label>{{surveydes.tit}}</label>
				<span>{{surveydes.des}}人测评过</span>
			</view>
			<view class="article">{{surveydes.article}}</view>
			<view class="gain">
			<view class="gain_tit">
				通过本次测试，你将获得：
			</view>
			{{surveydes.gain}}</view>
			<view class="explain">
			<view class="explain_tit">
				测评说明：
			</view>{{surveydes.explain}}</view>
			<view class="start" @click="start(surveydes.id)">开始测评</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				surveydes:{
						id:'1',
						tit:'心理健康问卷',
						des:'1.1w',
						article:'抑郁症是常见的心理障碍，其症状表现为：心境低落、思维迟缓、意志活动减退、认知功能损害、躯体症状等。在生活中常有悲观消沉，灰心丧气，对所有事情都提不起兴趣，严重的还会出现肢体僵硬和耳鸣等症状。部分人有明显的焦虑和运动性激越，严重者可出现幻觉、妄想等精神病性症状。在所有抑郁症患者的表现中，还有一个最主要的特点，就是意志力减弱，什么事情也不想做，记忆力衰退，注意力下降，学习困难，思维活动下降。',
						gain:'1、请根据自我感受来选择，参考时间为过去1~2周。',
						explain:'测试选项中的：无/偶尔 指没有出现过，或者过去一周内出现次数不超过1次',
					}
			};
		},
		onLoad: (option) => {
			console.log(option.id)
			uni.request({
				url:"",
				data:"",
				success: (res) => {
					
				}
			})
		},
		methods:{
			start(e){
				let id =e;
				uni.navigateTo({
					url:"/pages/answer/answer?id="+id,
					success: res => {},
					fail: () => {},
					complete: () => {}
				});
			}
		}
	}
</script>

<style lang="less">
	.cont {
		width: 100%;
		height: auto;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: center;
		overflow: hidden;
		.head_img {
			width: 720rpx;
			height: 300rpx;
			border-radius: 10rpx;
			overflow: hidden;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.head_tit {
			margin-top: 20rpx;
			height: 100rpx;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			align-items: center;

			label {
				font-size: 30rpx;
				color: black;
			}

			span {
				font-size: 24rpx;
				color: gray;
			}
		}

		.article {
			text-indent:50rpx;
			line-height: 40rpx;
			overflow: hidden;
			padding: 0 30rpx 0 30rpx;
			text-align: justify;
			text-overflow: ellipsis;
			margin-top: 40rpx;
			min-height: 350rpx;
		}

		.gain {
			.gain_tit{
				text-align: center;
					color: black;
					font-size: 28rpx;
					margin-bottom: 10rpx;
			}
			text-indent:50rpx;
			line-height: 40rpx;
			overflow: hidden;
			padding: 0 30rpx 0 30rpx;
			text-align: justify;
			text-overflow: ellipsis;
			margin-top: 50rpx;
			min-height: 500rpx;
		}

		.explain {
			text-indent:50rpx;
			line-height: 40rpx;
			overflow: hidden;
			padding: 0 30rpx 0 30rpx;
			text-align: justify;
			text-overflow: ellipsis;
			margin-top: 50rpx;
			min-height: 500rpx;
			.explain_tit{
				text-align: center;
					color: black;
					font-size: 28rpx;
					margin-bottom: 10rpx;
			}
		}

		.start {
			display: flex;
			margin-top: 80vh;
			justify-content: center;
			align-items: center;
			width: 720rpx;
			height: 55rpx;
			position: fixed;
			border: 1px #c8adc4 solid;
			box-shadow: 1px 1px 1px 1px lightgray;
			color: white;
			border-radius: 20rpx;
			background-color: #c8adc4;
			;
		}
	}
</style>
